<template>
  <!--操作栏：编辑对话框-->
  <el-dialog :model-value="visible" @close="dialogClose"  width="42%"  >
    <!--标题-->
    <template #header>
      <div style="font-size:18px; color:#409eff; font-weight:bold;">查看工单</div>
    </template>

    <el-form :model="row" ref="formRef" label-width="100" :inline="true">
      <!-- 配置idc选择，通过下拉框选择-->
      <el-form-item label="部门管理：" >
        <el-input v-model="row.department.name" suffix-icon="Edit" disabled></el-input>
      </el-form-item>
      <el-form-item label="项目管理：" >
        <el-input v-model="row.project.name" suffix-icon="Edit" disabled></el-input>
      </el-form-item>
      <el-form-item label="服务模块：" >
        <el-input v-model="row.server.name" suffix-icon="Edit" disabled></el-input>
      </el-form-item>
      <el-form-item label="状态：" >
        <el-input v-model="row.status" suffix-icon="Edit" disabled></el-input>
      </el-form-item>
      <el-form-item label="申请人：" >
        <el-input v-model="row.applicant" suffix-icon="Edit" disabled></el-input>
      </el-form-item>
      <el-form-item label="工单号：">
        <el-input v-model="row.work_order_number" suffix-icon="Edit" disabled></el-input>
      </el-form-item>
      <el-form-item label="子版本号：">
        <el-input v-model="row.version" suffix-icon="Edit" disabled></el-input>
      </el-form-item>
      <el-form-item label="优先级：">
        <el-input v-model="row.priority" suffix-icon="Edit" disabled></el-input>
      </el-form-item>
      <el-form-item label="影响范围：" >
        <el-input v-model="row.reach" suffix-icon="Edit" disabled></el-input>
      </el-form-item>
      <el-form-item label="故障描述：" >
        <el-input v-model="row.fault_description" type="textarea"  style="width: 233px;"></el-input>
      </el-form-item>
      <el-form-item label="故障原因：" >
        <el-input v-model="row.Fault_cause" type="textarea" style="width: 233px;"></el-input>
      </el-form-item>
      <el-form-item label="如何修改：">
        <el-input v-model="row.modify" type="textarea" style="width: 233px;"></el-input>
      </el-form-item>

      <el-form-item label="脚本：">
        <el-input v-model="row.script" type="textarea" style="width: 233px;"></el-input>
      </el-form-item>
      <el-form-item label="配置：">
        <el-input v-model="row.config" type="textarea" style="width: 233px;"></el-input>
      </el-form-item>
      <el-form-item label="回退原因：">
        <el-input v-model="row.fallback" type="textarea" style="width: 233px;"></el-input>
      </el-form-item>
      <el-form-item label="备注：">
        <el-input v-model="row.note" type="textarea" style="width: 233px;"></el-input>
      </el-form-item>
      <el-form-item label="响应工时：">
        <el-input v-model="row.corresponding_working_hours" suffix-icon="Edit" ></el-input>
      </el-form-item>
      <el-form-item label="处理工时：">
        <el-input v-model="row.processing_working_hours" suffix-icon="Edit" ></el-input>
      </el-form-item>
      <el-form-item label="响应时间：">
        <el-date-picker v-model="row.response_time" type="date" placeholder="选择日期" style="width:100%;" ></el-date-picker>
      </el-form-item>
      <el-form-item label="处理时间：">
        <el-date-picker v-model="row.processing_time" type="date" placeholder="选择日期" style="width:100%;" ></el-date-picker>
      </el-form-item>
      <el-form-item label="创建时间：">
        <el-date-picker v-model="row.create_time" type="date" placeholder="选择日期" style="width:100%;" ></el-date-picker>
      </el-form-item>
      <el-form-item label="修改时间：">
        <el-date-picker v-model="row.update_time" type="date" placeholder="选择日期" style="width:100%;" ></el-date-picker>
      </el-form-item>
    </el-form>

  </el-dialog>
</template>

<script>
export default {
  name: 'WorkOrderEdit',
  // 介绍父组件的值
  props: {
    visible: Boolean, // 获取dialog是否打开变量
    row: {
      type: [Object,String,Number],
      default: 0
    }
  },
  data() {
    return {
      role: '',
    }
  },
  methods: {
    // 点击关闭，子组件通知父组件更新属性
    dialogClose() {
      this.$emit('update:visible', false) // 父组件必须使用 v-model
      this.$parent.GetAllWorkOrder() // 调用父组件方法，更新数据
    },
  },
}
</script>

<style scoped></style>
